<template>
  <router-view />
</template>
<script setup lang="ts">
import { provide, ref} from 'vue';
import { leftAsideStore } from 'maotu';
const modulesFiles = import.meta.glob("/public/electrical_symbols_library/**.svg", { eager: true, as: 'raw' })
import {SocketMessage, useSocket} from './api/websocketService.ts';
const modules = import.meta.glob("../src/components/*.vue", { eager: true });

const register_config: any = [];
// [{
//   id: 'electrical_symbols_变压器',
//   title: '变压器',
//   type: 'custom-svg',
//   thumbnail: '/electrical_symbols_library/变压器.svg',
//   props: {
//     strokeColor: {
//       type: 'color',
//       val: '#FF0000',
//       title: '圆颜色'
//     }, propType: {
//       type: 'select',
//       val: '1',
//       title: '变量类型',
//       options: [
//         {
//           value: '1',
//           label: '模拟量'
//         },
//         {
//           value: '2',
//           label: '状态量'
//         }
//       ]
//     }, state: {
//       type: 'select',
//       val: '1',
//       title: '开关',
//       options: [
//         {
//           value: '0',
//           label: '开'
//         },
//         {
//           value: '1',
//           label: '关'
//         }
//       ]
//     }, text: {
//       type: 'input',
//       val: '1',
//       title: '内容',
//     }
//   }
// }, {
//   id: 'electrical_symbols_断路器',
//   title: '断路器',
//   type: 'custom-svg',
//   thumbnail: '/electrical_symbols_library/断路器.svg',
//   props: {
//     strokeColor: {
//       type: 'color',
//       val: '#FF0000',
//       title: '圆颜色'
//     }, state: {
//       type: 'switch',
//       val: 0,
//       title: '开关',
//       options: [
//         {
//           value: 1,
//           label: '开'
//         },
//         {
//           value: 0,
//           label: '关'
//         }
//       ]
//     }, text: {
//       type: 'input',
//       val: 0,
//       title: '值',
//     }
//   }
// }];
for (const key in modules) {
  const component: any = modules[key];
  let name = component.default.__name;
  let iconName = name.split("electrical_symbols_")[1]

  let iconConfig = {
    id: name,
    title: iconName,
    type: "custom-svg",
    thumbnail: `/electrical_symbols_library/${iconName}.svg`,
    props: {
      strokeColor: {
        type: "color",
        val: "#FF0000",
        title: "颜色",
      },
      propType: {
        type: "select",
        val: "1",
        title: "变量类型",
        options: [{
          value: "1",
          label: "模拟量",
        },
        {
          value: "2",
          label: "状态量",
        },
        ],
      },
      state: {
        type: "switch",
        val: true,
        title: "开关",
        options: [{
          value: true,
          label: "开",
        },
        {
          value: false,
          label: "关",
        },
        ],
      },
      text: {
        type: "input",
        val: "",
        title: "内容",
      },
      lineWidth:{}
    },
  };
  if (iconName == '抽屉开关') {
    iconConfig.props["strokeColor2"] = {
      type: "color",
      val: "#FF0000",
      title: "颜色2",
    }
  }
  register_config.push(
    iconConfig
  );
}

// for (const key in modulesFiles) {
//   //根据路径获取svg文件名
//   const name = key.split("/").pop().split(".")[0];
//   register_config.push({
//     id: name,
//     title: name,
//     type: 'svg',
//     thumbnail: key.replace('/public', ''),
//     svg: modulesFiles[key],
//     props: {
//       strokeColor: {
//         type: 'color',
//         val: '#FF0000',
//         title: '线条颜色'
//       },
//       propType: {
//         type: 'select',
//         val: '1',
//         title: '变量类型',
//         options: [
//           {
//             value: '1',
//             label: '模拟量'
//           },
//           {
//             value: '2',
//             label: '状态量'
//           }
//         ]
//       }
//     }
//   })
// }

leftAsideStore.registerConfig('电气符号', register_config);

const webSocketData = ref<SocketMessage>({
  value: 0
})
const {on, send} = useSocket(import.meta.env.VITE_WEBSOCKET_URL);
/**
 * 收到服务端数据
 */
on('message', (data: any) => {
  webSocketData.value = data;
});
/**
 * 像socket 发送订阅消息
 * @param message
 */
const sendData = (message: { action: string, varSn: any}) => {
  const params = {
    action: message.action,
    bizSn: message.varSn
  }
  send(JSON.stringify(params))
}
provide('webSocketData', {
  data: webSocketData,
  sendData:sendData
});

</script>
<style scoped></style>
